import React from 'react'
import {Link} from 'react-router-dom'

import MUtil from 'util/mm.jsx'
const __mm=new MUtil();

import User from 'service/user-service.jsx'
const __user=new User();

class TopNav extends React.Component{
    constructor(props){
        super(props);
        this.state={
            username:__mm.getStorage('userInfo').username || ''
        }
    }
    onLogout(){
        __user.logout().then(res=>{
            __mm.removeStorage('userInfo');
            window.location.href='/login';
        },errmsg=>{
            __mm.errorTips(errmsg);
        })
    }
    render(){
        return(
            <div className="navbar navbar-default top-navbar">
                <div className="navbar-header">
                    <Link to='/' className="navbar-brand"><b>Happy</b>one</Link>
                </div>

                <ul className="nav navbar-top-links navbar-right">
                    <li className="dropdown">
                        <a className="dropdown-toggle" href="javascript:;" aria-expanded="false">
                            <i className="fa fa-user fa-fw"></i>
                            {
                                this.state.username
                                ?<span>欢迎,{this.state.username}</span>
                                :<span>欢迎您</span>
                            }
                            <i className="fa fa-caret-down"></i>
                        </a>
                        <ul className="dropdown-menu dropdown-user">
                            <li>
                                <a href='javascript:;' onClick={e=>{this.onLogout(e)}}>
                                    <i className="fa fa-sign-out fa-fw"></i>
                                    <span>退出登录</span>
                                </a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        )
    }
}

export default TopNav;